<template>
  <div>
<h1>{{obj}}</h1>
<h1>{{name}}</h1>
<h1>{{age}}</h1>

<button @click="age++">修改age</button>
<h1>{{tom}}</h1>
<h1>{{user}}</h1>
<button @click="tom=!tom">修改tom</button>

  </div>
</template>

<script setup lang="ts">
import { reactive, ref, toRefs } from 'vue';

const obj = ref({
  name:'tom',
  age:19
})


const {name,age} = toRefs(obj.value)

const user = reactive({
 tom:true
})

const {tom} = toRefs(user)

</script>

<style scoped>

</style>